<template>
 <div class="App">
   <h1 class="title">App组件</h1>
   <input type="text" v-model="msg"/>搜索
   {{msg}}
   <input type="text" ref="iptEle"/>搜索2
   <button @click="getiptEle">获取ref的值</button>
   {{msg}}
   <Count ref="countCom"/>
 </div>
</template>

<script>
import Count from './components/Count.vue'
export default {
  name: "App",
  components: {
    Count
  },
  data() {
    return {
      msg: ""
    }
  },
  methods: {
    getiptEle() {
      console.log(this.$refs.iptEle.value);
      // 如果ref设置给了子组件上,则我们通过$refs拿到的是这个组件的组件实例
      //   最常用的就是通过子组件的实例拿到子组件的数据进行处理(组件通信-->子传父)
      console.log(this.$refs.countCom.count++);
    }
  }

}
</script>

<style scoped>
  
</style>